<template>
  <aigc-dialog ref="aigcDialogInstance" :dialog-title="title" width="300">
    <el-row>
      <el-col :span="24">
        <el-input v-model="rechargeAmount">
          <template #prefix> 
            <el-icon>
                <svg-icon icon-name="icon-fenxiangzidongzhuanru"/>
            </el-icon>
          </template>
        </el-input>
      </el-col>
    </el-row>
    <template #dialogfooter>
      <el-button type="primary" @click="setMoney"> 确认 </el-button>
    </template>
  </aigc-dialog>
</template>
<script lang="ts" setup>
import { Ref, ref } from "vue";
import aigcDialog from "@/components/aigcDialog";
import { aigcMsg, aigcMsgType } from "@/utils";
import { ElIcon } from "element-plus";
const rechargeAmount: Ref<number> = ref<number>(0);
const title = ref<string>("充值金额");
const aigcDialogInstance = ref();
const openDialog = (isOPen: boolean) => {
  aigcDialogInstance.value.openDialog(isOPen);
};
const emits = defineEmits<{
  (e: "refishMoney", money: number): void;
}>();
const setMoney = () => {
  //todo 加入第三方sdk充值调用
  openDialog(false);
  emits("refishMoney", rechargeAmount.value);
  rechargeAmount.value = 0;
  aigcMsg({ msg: "充值成功", type: aigcMsgType.SUCCESS });
};

defineExpose({ openDialog });
</script>
<style lang="scss" scoped>
::v-deep(.el-input__wrapper) {
  padding-right: 0px;
}
</style>
